<div class="sl">
<div>数量</div>
<div>-</div>
<input type="number" value="1" min='1' max='99' class="activate" onpaste="return false">
<div>+</div>
</div>
.sl{
position: relative;
border-bottom: 1px solid rgb(222,222,222);
height: 100px;
}
.sl div{
position: relative;
display: inline-block;
width: 60px;
height: 27px;
line-height: 27px;
text-align: center;
}
.sl div:nth-child(1){
margin: 15px 0 0 0;
font-size: 13px;
border: 0;
}
.sl div:nth-child(2){
border-right: none;
top: 40px;
left: -45px;
color: #00aaff;
background: white;
}
.sl input{
position: relative;
border: none;
border-radius: 0;
width: 60px;
height: 27px;
top: 38px;
left: -48px;
text-align: center;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
.sl div:nth-child(4){
border-left: none;
top: 40px;
left: -51px;
color: #00aaff;
background: white;
}
$(".sl div:nth-child(4)").on("tap",function(){
if($(".sl input").val()!=""){
var val=parseInt($(".sl input").val());
}else{
$(".sl input").val("1");
return;
}
if(val>=99){
return;
}else{
val=val+1;
}
$(".sl input").val(val);
});
$(".sl div:nth-child(2)").on("tap",function(){
var val=parseInt($(".sl input").val());
if(val<=1){
return
}else{
val=val-1;
$(".sl input").val(val);
}
});
$(".sl input").on("keydown",function(e){
if(e.keyCode<=48||e.keyCode>57){
if(e.keyCode==8){
return;
}else if(e.keyCode==48){
if($(this).val()==""||$(this).val().length==0){
e.preventDefault();
return false;
}
}else{
e.preventDefault();
return false;
}
}
});
$(".sl input").on("keyup",function(e){
if(e.keyCode<=48||e.keyCode>57){
if(e.keyCode==8){
return;
}else{
e.preventDefault();
return false;
}
}else{
if($(this).val().length<=2){
return;
}else{
$(this).val(99)
}
}
});
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。